<style>
    #add {
        padding: 20px 25px 25px 0;
    }

    #add .layui-treeSelect .ztree li a, .ztree li span {
        margin: 0 0 2px 3px !important;
    }
</style>
<div class="layui-fluid" id="contentUpdate">
    <form class="layui-form" action="" lay-filter="content-update-form" enctype="multipart/form-data" id="content-update-form">



        <div class="layui-form-item" style="display: none">
            <label class="layui-form-label febs-form-item-require">实验ID</label>
            <div class="layui-input-block">
                <input type="text" name="tActivityId"  class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label febs-form-item-require">背景颜色：</label>
            <div class="layui-input-inline" style="width: 120px;">
                <input type="text" value="" placeholder="请选择颜色" name="backgroundColor" class="layui-input" id="test-form-input">
            </div>
            <div class="layui-inline" style="left: -11px;">
                <div id="test-form"></div>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">活动内容</label>
            <div class="layui-input-block">
                <input type="hidden" name="remark" id="remark">
                <div id="editor"></div>
            </div>
        </div>


        <div class="layui-form-item febs-hide">
            <button class="layui-btn" lay-submit="" lay-filter="contentUpdate-form-submit" id="submit"></button>
            <button type="reset" class="layui-btn" id="reset"></button>
            <input type="hidden" name="test">
        </div>
    </form>
</div>
<script data-th-inline="javascript">
    layui.use(['febs', 'form', 'layedit', 'validate','colorpicker', 'upload'], function () {
        var $ = layui.$,
            febs = layui.febs,
            layer = layui.layer,
            form = layui.form,
            activity = [[${activity}]],
            colorpicker = layui.colorpicker,
            laydate = layui.laydate,
            layedit = layui.layedit,
            upload = layui.upload,
            validate = layui.validate;

        form.verify(validate);
        form.render();

        var E = window.wangEditor;
        var editor = new E('#editor');
        // 或者 var editor = new E( document.getElementById('editor') )

        // 关闭粘贴内容中的样式
        editor.config.pasteFilterStyle = false;
        // 忽略粘贴内容中的图片
        editor.config.pasteIgnoreImg = true;
        //开启debug模式
        editor.config.debug = true;
        // 配置服务器端地址
        editor.config.uploadImgServer = ctx + 'activity/uploadActivityPic';
        //自定义 fileName
        editor.config.uploadFileName = 'file';

        // 自定义菜单配置
        editor.config.menus = [
            'bold',  // 粗体
            'fontSize',  // 字号
            'fontName',  // 字体
            'italic',  // 斜体
            'underline',  // 下划线
            'strikeThrough',  // 删除线
            'foreColor',  // 文字颜色
            'backColor',  // 背景颜色
            'link',  // 插入链接
            'list',  // 列表
            'justify',  // 对齐方式
            'quote',  // 引用
            'emoticon',  // 表情
            'image',  // 插入图片
            'table',  // 表格
            'undo',  // 撤销
            'redo'  // 重复
        ]

        editor.create();

        editor.txt.html(activity.content);


        // $("#experiment_table").attr("ts-selected", project.courseId);


        initUserValue();

        function initUserValue() {
            console.log("id",activity.tactivityId)
            form.val("content-update-form", {
                "tActivityId":activity.tactivityId,
            });
        }

        colorpicker.render({
            elem: '#test-form'
            ,color: activity.backgroundColor
            ,done: function(color){
                $('#test-form-input').val(color);
            }
        });


        form.on('submit(contentUpdate-form-submit)', function (data) {
            var formData = new FormData(document.getElementById("content-update-form"));
            data.field.content = editor.txt.html();
            formData.append("content",data.field.content);
            console.log(data.field)

            $.ajax({
                url: ctx + 'activity/updateContent',
                data: formData,
                type: 'post',
                dataType: 'json',
                processData: false,
                contentType: false,
                success: function (data) {
                    if (data.code == 200) {
                        layer.msg('操作成功', {
                            icon: 6,
                            time: 1000
                        }, function () {
                            layer.closeAll();
                            $('#activity').find('#reset').click();
                        });
                    } else {
                        layer.msg('操作失败', {
                            icon: 5,
                            time: 1000
                        });
                    }
                },
                error: function (data) {
                    layer.msg('操作失败', {
                        icon: 5,
                        time: 1000
                    });
                }
            });
            return false;
        });
    });
</script>